'use strict';

let directLists = ['我的笔记', '代码学习', '业余记录'];
let noteLists = [{'title': '面向对象', 'content': ''}];
let activeDirect = null;
let activeNote = null;


$(function(){
	initDirectList();
	initNoteContent();

	$("#fontcolorSetting").colorpicker({
		alpha:false,
		close:fontColorEventListener
	});

	$("#strokecolorSetting").colorpicker({
		alpha:false,
		close:strokeColorEventListener
	});

	hideText();
	$("#paintLabel").click(()=>{
		toggleTool(paintOrText);
		if(paintOrText)
		{
			hidePaint();
			paintOrText = false;
			showText();
		}
		else
		{
			showPaint();
			paintOrText = true;
			hideText();
		}

	});

	$("#textLabel").click(()=>{
		toggleTool(paintOrText);
		if(!paintOrText)
		{
			hideText();
			paintOrText = true;
			showPaint();
		}
		else
		{
			showText();
			paintOrText = false;
			hidePaint();
		}

	});

	$("#directFold").click(function(){
		let direction = foldFile(0, 2, 1);

		if(direction)
		{
			$(this).removeClass("icon-format-horizontal-align-left");
			$(this).addClass("icon-format-horizontal-align-right");
			$(this).attr('data-mtpis', '展开目录列表');
			hideDirectList();
		}
		else
		{
			$(this).addClass("icon-format-horizontal-align-left");
			$(this).removeClass("icon-format-horizontal-align-right");
			$(this).attr('data-mtpis', '折叠目录列表');
			showDirectList();
		}


	});

	$("#noteFold").click(function(){
		let direction = foldFile(1, 3, 2);
		if(direction)
		{
			$(this).removeClass("icon-format-horizontal-align-left");
			$(this).addClass("icon-format-horizontal-align-right");
			$(this).attr('data-mtpis', '展开笔记列表');
			hideNoteList();
		}
		else
		{
			$(this).addClass("icon-format-horizontal-align-left");
			$(this).removeClass("icon-format-horizontal-align-right");
			$(this).attr('data-mtpis', '折叠笔记列表');
			showNoteList();
		}
	});

	$("#noteFold").trigger('click');
	$("#directFold").trigger("click");

	$('#closeBtn span:eq(0)').click(()=>ipcRenderer.send('quit-program'));
	$('#minimize span:eq(0)').click(()=>ipcRenderer.send('minimize-program'));
	$('#minimizeShadow span:eq(0)').click(()=>ipcRenderer.send('minimize-shadow'));

	$("#historyBtn").click(()=>$("#historyDetail").modal({'backdrop':'static'}));
	$("#historyClose").click(()=>$("#historyDetail").modal('hide'));

	$("#shareBtn span").click(()=>$("#shareDetail").modal());
	$("#shareClose").click(()=>$("#shareDetail").modal('hide'));


});

function hidePaint()
{
	$("#paintPanel span").slideUp();
	$("#strokecolorSetting").slideUp();
	$("#paintPanel").animate({height: '36px'});
}

function showPaint()
{
	$("#paintPanel span").slideDown();
	$("#strokecolorSetting").slideDown();
	$("#paintPanel").animate({height: '360px'});
}

function hideText()
{
	$("#textPanel span").slideUp();
	$("#textPanel select").slideUp();
	$("#textPanel input").slideUp();
	$("#textPanel").animate({height: '36px'});
}

function showText()
{
	$("#textPanel span").slideDown();
	$("#textPanel select").slideDown();
	$("#textPanel input").slideDown();
	$("#textPanel").animate({height: '360px'});
}

function fontColorEventListener(e)
{

  $("#fontcolorSetting").css({'background': '#' + $(this).val()});
}

function strokeColorEventListener(e)
{

  $("#strokecolorSetting").css({'background': '#' + $(this).val()});
  let ctx = $("#painter")[0].getContext('2d');
  ctx.strokeStyle = '#' + $(this).val();
}

function foldFile(index, init, value)
{
	let cFile = $("#fileManager").attr('class');
	let cContent = $("#editContent").attr('class');
	let left = true;
	if(partition[index] == init)
	{
		partition[index] -= value;
		partition[2] += value;
	}
	else
	{
		partition[index] += value;
		partition[2] -= value;
		left = false;
	}
	$("#fileManager").removeClass(cFile);
	$("#fileManager").addClass('col-md-' + (12-partition[2]));
	$("#editContent").removeClass(cContent);
	$("#editContent").addClass('col-md-' + partition[2]);

	let height = $("#paintArea")[0].scrollHeight;
	let width = $("#paintArea")[0].scrollWidth;
	repaintCanvas(height, width, true);

	$("#contentInput").css({'height':height, 'width': width});
	return left;
}

function initDirectList()
{
	$("#noteDirectory").html("");
	for(let i = 0; i < directLists.length; i++)
	{
		let direct = directLists[i];
		let item = $("<li></li>");
		let link = $("<a></a>");
		item.click(function(){
			if(activeDirect)
				activeDirect.removeClass('active');
			$(this).addClass('active');
			activeDirect = $(this);
			$("#directTitle span:eq(1)").text($(this).find('a').text());
		});
		link.text(direct);
		item.append(link);
		$('#noteDirectory').append(item);
	}
}

function initNoteContent()
{
	$("#noteContent").html("");
	for(let i = 0; i < noteLists.length; i++)
	{
		let note = noteLists[i];
		let wrapper = $('<div></div>');
		wrapper.attr('id', 'note_' + i);
		wrapper.attr('class', 'note');
		let title = $('<div></div>');
		title.attr('class', 'noteTitle');
		title.html("<span class='iconfont icon-jobtitle'></span> &nbsp;<span>" + note.title + "</span>");
		let content = $('<div></div>');
		content.attr('class', 'noteDetail');
		content.html("<span class='iconfont icon-content'></span> <span>" + note.content + "</span>");
		wrapper.append(title, content);
		$("#noteContent").append(wrapper);
	}
}

function hideDirectList()
{
	$("#navHead span:eq(1)").text("");
	for(let i = 0; i < $("#noteDirectory").children().length; i++)
	{
		let direct = $("#noteDirectory").children()[i];
		$(direct).find("a").text("");
	}
}

function hideNoteList()
{
	$("#directTitle span:eq(1)").text("");
	for(let i = 0; i < $("#noteContent").children().length; i++)
	{
		let child = $("#noteContent").children()[i];
		$(child).find('.noteTitle').css({'text-align': 'center'});
		$(child).find('.noteTitle span:eq(1)').text("");
		//$(child).find('.noteDetail').css({'text-align': 'center'});
		//$(child).find('.noteDetail span:eq(1)').text("");
	}
}

function showDirectList()
{
	initDirectList();
}

function showNoteList()
{
	$("#directTitle span:eq(1)").text(activeDirect ? directLists[activeDirect.index()] : "");
	initNoteContent();
}